<!--  账务管理————————》  收入列表弃用 -->   
<template>
  <div>
    <a-row>
      <a-col :span="24">
        <a-card :bordered="false">
          <!--    系统当前账户全额信息   -->
          <div v-show='flag.sysFlag' class="table-page-search-wrapper">
            <span>总部利润（单位：元）：{{ balance.sysBalance }}</span>
          </div>
          <!--    分站当前账户全额信息   -->
          <div v-show='flag.notSysFlag' class="table-page-search-wrapper">
            <span>当前账户总余额（单位：元）：{{ balance.totalBalance }}</span>
            <span style="margin-left: 20px;">其中待提现：{{ balance.dtxBalance }}</span>
            <span style="margin-left: 20px;">已申请提现待总部审核：{{ balance.ysqdshBalance }}</span>
            <span style="margin-left: 20px;">总部审核通过待转账：{{ balance.shtgdzzBalance }}</span>
            <span style="margin-left: 20px;">提现申请被驳回：{{ balance.bhBalance }}</span>
            <!--            <span style="margin-left: 20px;">当前可申请提现金额（待提现 + 提现申请被驳回）：{{ balance.dtxBalance }}</span>-->
            <span style='margin-left: 20px;'>
              <a @click="balanceWithdrawApply" style='margin-right: 10px;'>申请提现</a>
            </span>
          </div>
          <!-- 查询区域 -->
          <div class="table-page-search-wrapper">
            <a-form layout="inline" @keyup.enter.native="searchQuery">
              <a-row :gutter="24">
                <a-col :xl="4" :lg="6" :md="8" :sm="12" :xs="24">
                  <a-form-item label="记录时间">
                    <a-date-picker valueFormat="YYYY-MM-DD HH:mm:ss" v-model="queryParam.createTime" placeholder="请选择记录时间" />
                  </a-form-item>
                </a-col>

                <a-col :xl="4" :lg="6" :md="8" :sm="12" :xs="24" v-show="usertype == 1">
                  <a-form-model-item label="分站：" prop="siteId">
                    <a-select placeholder="请选择分站" v-model="queryParam.siteId" show-search :showArrow="false" allowClear :filter-option="filterSelectOption" @change="changeSiteId">
                      <a-select-option :value="undefined" selected>请选择分站</a-select-option>
                      <a-select-option v-for="item in siteList" :key="item.id" :value="item.id">
                        {{ item.name }}
                      </a-select-option>
                    </a-select>
                  </a-form-model-item>
                </a-col>

                <a-col :xl="4" :lg="6" :md="8" :sm="12" :xs="24" v-show="usertype == 1 || usertype == 2">
                  <a-form-model-item label="商家：" prop="merchantId">
                    <a-select placeholder="请选择商家" v-model="queryParam.merchantId" show-search :showArrow="false" allowClear :filter-option="merchantIdSelectOption" @change="changeMerchantId" :disabled="!queryParam.siteId">
                      <a-select-option :value="undefined" selected>请选择商家</a-select-option>
                      <a-select-option v-for="item in merchantList" :key="item.id" :value="item.id">
                        {{ item.name }}
                      </a-select-option>
                    </a-select>
                  </a-form-model-item>
                </a-col>
                <a-col :xl="4" :lg="6" :md="8" :sm="12" :xs="24">
                  <a-form-model-item label="门店：" prop="shopId">
                    <a-select placeholder="请选择门店" v-model="queryParam.shopId" show-search :showArrow="false" allowClear :filter-option="basicIdSelectOption" :disabled="!queryParam.merchantId">
                      <a-select-option :value="undefined" selected>请选择门店</a-select-option>
                      <a-select-option v-for="item in shoplist" :key="item.id" :value="item.id">
                        {{ item.name }}
                      </a-select-option>
                    </a-select>
                  </a-form-model-item>
                </a-col>
                <a-col :xl="4" :lg="6" :md="8" :sm="12" :xs="24">
                  <a-form-model-item label="提现状态：" prop="withdrawCashStatus">
                    <j-dict-select-tag placeholder="请选择" v-model="queryParam.withdrawCashStatus" dictCode="bill_withdraw_cash_status"></j-dict-select-tag>
                  </a-form-model-item>
                </a-col>
                <a-col :xl="4" :lg="6" :md="8" :sm="12" :xs="24">
                  <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
                    <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                  </span>
                </a-col>
              </a-row>
            </a-form>
          </div>
          <div>
            <a-table ref="table" size="middle" :scroll="{ x: true }" bordered rowKey="id" :columns="columns" :dataSource="dataSource" :pagination="ipagination" :loading="loading" class="j-table-force-nowrap" :rowClassName="tableRowColor"
              @change="handleTableChange">
              <span slot="action" slot-scope="text, record">
                <a @click="proDetail(record)">进度查询</a>
              </span>
            </a-table>
          </div>
        </a-card>
      </a-col>
    </a-row>
    <a-drawer :title="pro.title" placement="right" :closable="false" :visible="pro.flag" @close="proCancel" width='500'>
      <!--  时间轴方式展示   -->
      <div>
        <p>结算及提现各节点操作信息：</p>
        <a-timeline mode="alternate">
          <a-timeline-item v-for="(item, key) in pro.billLineHistories" :key="key">{{item.createTime}}
            ({{item.withdrawCashStatus==1?'结算':item.withdrawCashStatus==2?'发起提现待平台审核':item.withdrawCashStatus==3?'提现申请审核通过待转账':
              item.withdrawCashStatus==4?'提现申请被驳回':item.withdrawCashStatus==5?'（提现）转账成功':'（提现）转账失败'}})
          </a-timeline-item>
        </a-timeline>
      </div>
    </a-drawer>
  </div>
</template>
<script>

import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import JVxeRadioCell from '../../components/JVxeCells/JVxeRadioCell'
import { postAction, getAction } from '../../api/manage'
import store from '@/store'


export default {
  name: 'BillList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    JVxeRadioCell
    //SiteModal
  },
  data() {
    return {
      description: '收入列表',
      // 表头
      columns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '分站',
          align: "center",
          dataIndex: 'siteName',
        },
        {
          title: '商家',
          align: "center",
          dataIndex: 'merchantName',
        },
        {
          title: '门店',
          align: "center",
          dataIndex: 'shopName',
        },
        {
          title: '订单号',
          align: "center",
          dataIndex: 'orderNo',
        },
        {
          title: '实付金额',
          align: "center",
          dataIndex: 'payAmount'
        },
        {
          title: '收益比例',
          align: 'center',
          dataIndex: 'rakeRate',
          customRender: (t) => {
            return t * 100 + "%";
          }
        },
        {
          title: '本单收益',
          align: "center",
          dataIndex: 'rakeAmount',
        },
        {
          title: '备注',
          align: "center",
          dataIndex: 'mark',
          /*  render:(h,params)=>{
              console.log("params-----11---  ",params.row.mark)
              if(params.row.mark){
                return h('span',{
                  'style':{
                    'color':'#ED5A36'
                  }
                },params.row.mark);
              }else{
                return h('span',{'style':{
                    'color':'#ED5A36'
                  }},params.row.mark);
              }
            }*/
        },
        {
          title: '结算时间',
          align: "center",
          dataIndex: 'createTime',
        },
        {
          title: '结算时支付宝姓名',
          align: "center",
          dataIndex: 'rakeAliname',
        },
        {
          title: '结算时支付宝账号',
          align: "center",
          dataIndex: 'rakeAlipay',
        },
        {
          title: '申请提现时间',
          align: 'center',
          dataIndex: 'withdrawTime'
        },
        {
          title: '提现状态',
          align: "center",
          dataIndex: 'withdrawCashStatus_dictText',
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          fixed: 'right',
          width: "100px",
          scopedSlots: { customRender: 'action' },
        }
      ],
      merchantBalanceColumns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '门店',
          align: 'center',
          dataIndex: 'shopName'
        },
        {
          title: '余额（单位：元）',
          align: "center",
          dataIndex: 'balance'
        },
        {
          title: '上次提现时间',
          align: 'center',
          dataIndex: 'lastWithdrawTime'
        },
        {
          title: '上次提现金额',
          align: 'center',
          dataIndex: 'lastWithdrawMoney'
        },
        {
          title: '状态',
          align: 'center',
          dataIndex: 'withdrawStatus_dicText'
        },
        {
          title: '申请提现时间',
          align: 'center',
          dataIndex: 'withdrawApplyTime'
        },
        {
          title: '申请提现金额',
          align: 'center',
          dataIndex: 'withdrawApplyMoney'
        },
        {
          title: '提现申请被拒绝的原因',
          align: 'center',
          dataIndex: 'withdrawRejectReason'
        },
        {
          title: '操作',
          dataIndex: 'balanceAction',
          align: "center",
          fixed: 'right',
          width: "100px",
          scopedSlots: { customRender: 'balanceAction' },
        }
      ],
      // 右侧表头
      url: {
        list: "/finance/bill/withdrawCash/income/listByType",
        setting: "/site/set",
        allSite: "/merchant/certification/allSite",
        merchantAllList: "/merchant/certification/merchantAllList",
        listAll: "/shop/shopBasic/listAll",
        balance: "/finance/bill/withdrawCash/income/balance",
        withdrawApplication: "/finance/bill/withdrawCash/income/application",
        findBillLineHistoryByBillLineId: "/finance/bill/withdrawCash/income/lineHistoryByBillLineId",
      },
      queryParam: {
        type: 3
      },
      siteList: [],//分站列表
      merchantList: [], // 商家列表
      shoplist: [],//门店列表
      usertype: undefined,
      flag: {
        sysFlag: false,
        notSysFlag: false
      },
      oneBalance: {},
      balance: {},
      pro: {
        title: '',
        flag: false,
        billLineHistories: []
      }
    }
  },
  created() {
    const self = this;
    self.usertype = store.getters.userInfo.userType
    if (self.usertype == 1) {
      self.getallsite();
      self.flag.sysFlag = true;
    } else if (self.usertype == 2) {
      self.queryParam.siteId = store.getters.userInfoSite.id
      self.getallmerchant();
      self.flag.notSysFlag = true;
    } else if (self.usertype == 3) {
      self.queryParam.siteId = store.getters.userInfoSite.id
      self.queryParam.merchantId = store.getters.userInfoMerchant.id
      self.getallBasic();
      self.flag.notSysFlag = true;
    }
    self.queryParam = JSON.parse(JSON.stringify(self.queryParam));
    // 查询余额
    this.selectBalance();
  },
  computed: {
    // importExcelUrl: function(){
    //   return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
    // },
  },
  watch: {

  },
  methods: {
    // 获取当前登录用户的的余额列表
    billDetailBtn() {
      this.$message.info("查看待提现账单信息");
    },
    onChange(date, dateString) {
      console.log(date, dateString);
      // this.queryParam.createTime = date
    },
    changeSiteId() {
      this.merchantList = []
      this.shoplist = []
      this.queryParam.merchantId = undefined
      this.queryParam.shopId = undefined
      this.queryParam = JSON.parse(JSON.stringify(this.queryParam))
      if (this.queryParam.siteId) {
        this.getallmerchant()
      }
    },
    changeMerchantId() {
      this.shoplist = []
      this.queryParam.shopId = undefined
      this.queryParam = JSON.parse(JSON.stringify(this.queryParam))
      if (this.queryParam.merchantId) {
        this.getallBasic()
      }
    },
    // 输入筛选 分站
    filterSelectOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },
    // 输入筛选 商铺
    merchantIdSelectOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },
    // 输入筛选门店
    basicIdSelectOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },
    // 获取所有分站
    getallsite() {
      const self = this;
      self.siteList = []
      getAction(self.url.allSite, {}).then(res => {
        console.log(res)
        if (res.success) {
          self.siteList = res.result
        } else {
          self.$message.warning(res.message);
        }
      })
    },
    // 获取分站下所有商铺
    getallmerchant() {
      const self = this;
      self.merchantList = []
      getAction(self.url.merchantAllList, { siteId: this.queryParam.siteId }).then(res => {
        console.log(res)
        if (res.success) {
          self.merchantList = res.result
        } else {
          self.$message.warning(res.message);
        }
      })
    },
    // 获取分站下当前商铺的所有门店
    getallBasic() {
      const self = this;
      self.shoplist = []
      getAction(self.url.listAll, { merchantId: this.queryParam.merchantId }).then(res => {
        console.log(res)
        if (res.success) {
          self.shoplist = res.result
        } else {
          self.$message.warning(res.message);
        }
      })
    },
    // 账户余额查询明细
    balanceDetail(record) {
      this.queryParam = {};
      this.queryParam.billBalanceId = record.billBalanceId;
      this.searchQuery();
    },
    // 查询余额
    selectBalance() {
      const self = this;
      self.balance = {};
      getAction(self.url.balance, self.queryParam).then(res => {
        console.log("selectBalance----->   ", res);
        if (res.success) {
          self.balance = res.result;
        } else {
          self.$message.warning("获取余额信息失败！");
        }
      });
    },
    // 申请提现
    balanceWithdrawApply() {
      const self = this;
      postAction(self.url.withdrawApplication).then(res => {
        if (res.success) {
          self.$message.success(res.message);
          // 刷新列表数据
          this.searchQuery();
          // 刷新页面顶部数据
          this.selectBalance();
        } else {
          self.$message.warning(res.message + ",请检查有没有待提现的账单信息！");
        }
      });
    },
    // 查询进度
    proDetail(record) {
      const self = this;
      self.pro.flag = true;
      self.pro.title = "订单" + record.orderNo + "的收益记录";
      getAction(self.url.findBillLineHistoryByBillLineId, { billLineId: record.id }).then(res => {
        console.log(res);
        if (res.success) {
          self.pro.billLineHistories = res.result;
        } else {
          self.$message.warning("获取账单行历史信息失败！");
        }
      });
    },
    proCancel() {
      this.pro.flag = false;
      this.pro.billLineHistories = [];
    },
    tableRowColor(record, index) {
      // console.log("record.mark----->    " + index, record.mark);
      if (record.mark) {
        return "red-color";
      }
    }
  },


}
</script>
<style>
.red-color {
  background-color: #e6f7ff;
}
</style>
<style scoped>
@import '~@assets/less/common.less';
</style>